<template>
  <div class="container">
    <FormList
      ref="formRef"
      :formList="editAddList"
      :num="24"
      :gutter="24"
      layout="horizontal"
      :btnSpan="18"
      :showResetBtn="false"
      btnTitle="保存"
      :labelCol="8"
      :wrapperCol="16"
      :btnWarpSpan="14"
      :btnWarpOffset="4"
      @Search="editForm"
    />
  </div>
</template>
  
<script setup>
import { ref } from "vue";
import { getList, edit } from "@/api/system";
import { reactive } from "vue";
import { message } from "ant-design-vue";
const props = defineProps({
  type: String,
});
const formRef = ref();
const state = reactive({
  formData: {},
});

var editAddList = reactive([
  {
    type: "radio", //类型
    label: "减库存", //标签
    name: "stock_type", //字段
    rules: [{ required: true, message: "请选择" }], //规则
    formProps: {}, //form的props
    itemProps: {
      data: [
        {
          id: "1",
          name: "下单减",
        },
        {
          id: "2",
          name: "支付减",
        },
      ],
    }, //item的props
  },
  {
    type: "inputNumber", //类型
    label: "关闭订单时间(分)", //标签
    name: "close_time", //字段
    rules: [{ required: true, message: "请输入" }], //规则
    formProps: {}, //form的props
    itemProps: {}, //item的props
  },
  {
    type: "inputNumber", //类型
    label: "自动确认收货时间(天)", //标签
    name: "confirm_time", //字段
    rules: [{ required: true, message: "请输入" }], //规则
    formProps: {}, //form的props
    itemProps: {}, //item的props
  },
  {
    type: "inputNumber", //类型
    label: "自动完成订单时间(天)", //标签
    name: "complete_time", //字段
    rules: [{ required: true, message: "请输入" }], //规则
    formProps: {}, //form的props
    itemProps: {}, //item的props
  },
  {
    type: "radio", //类型
    label: "是否允许支付宝支付", //标签
    name: "is_alipay", //字段
    rules: [{ required: true, message: "请选择" }], //规则
    formProps: {}, //form的props
    itemProps: {
      data: [
        {
          id: "1",
          name: "是",
        },
        {
          id: "0",
          name: "否",
        },
      ],
    }, //item的props
  },
  {
    type: "radio", //类型
    label: "是否允许微信支付", //标签
    name: "is_wechat", //字段
    rules: [{ required: true, message: "请选择" }], //规则
    formProps: {}, //form的props
    itemProps: {
      data: [
        {
          id: "1",
          name: "是",
        },
        {
          id: "0",
          name: "否",
        },
      ],
    }, //item的props
  },
  {
    type: "img", //类型
    label: "待付款图", //标签
    name: "order_pay", //字段
    rules: [{ required: true, message: "请选择" }], //规则
    formProps: {}, //form的props
    itemProps: {}, //item的props
  },
  {
    type: "img", //类型
    label: "待发货图片", //标签
    name: "order_send", //字段
    rules: [{ required: true, message: "请选择" }], //规则
    formProps: {}, //form的props
    itemProps: {}, //item的props
  },
  {
    type: "img", //类型
    label: "待收货图片", //标签
    name: "order_accept", //字段
    rules: [{ required: true, message: "请选择" }], //规则
    formProps: {}, //form的props
    itemProps: {}, //item的props
  },
  {
    type: "img", //类型
    label: "已收货图片", //标签
    name: "order_confirm", //字段
    rules: [{ required: true, message: "请选择" }], //规则
    formProps: {}, //form的props
    itemProps: {}, //item的props
  },
  {
    type: "img", //类型
    label: "已完成图片", //标签
    name: "order_complete", //字段
    rules: [{ required: true, message: "请选择" }], //规则
    formProps: {}, //form的props
    itemProps: {}, //item的props
  },
  {
    type: "img", //类型
    label: "已关闭图片", //标签
    name: "order_close", //字段
    rules: [{ required: true, message: "请选择" }], //规则
    formProps: {}, //form的props
    itemProps: {}, //item的props
  },
  {
    type: "inputNumber",
    label: "售后自动确认收货【平台】",
    name: "refund_plt_confirm", //字段
    rules: [{ required: true, message: "请输入" }], //规则
    formProps: {}, //form的props
    itemProps: {}, //item的props
  },
  {
    type: "inputNumber",
    label: "售后自动确认收货【用户】【换货】",
    name: "refund_user_confirm", //字段
    rules: [{ required: true, message: "请输入" }], //规则
    formProps: {}, //form的props
    itemProps: {}, //item的props
  },
  {
    type: "input", //类型
    label: "特价商品发货时间", //标签
    name: "special_send_day", //字段
    rules: [{ required: true, message: "请输入" }], //规则
    formProps: {}, //form的props
    itemProps: {}, //item的props
  },
  {
    type: "input", //类型
    label: "申购商品订单未支付失效时间[分]", //标签
    name: "subscribe_expire_time", //字段
    rules: [{ required: true, message: "请输入" }], //规则
    formProps: {}, //form的props
    itemProps: {}, //item的props
  },
]);

// 获取列表
const getData = () => {
  getList({
    s_group: props.type,
  }).then((res) => {
    if (res.code == 0) {
      const data = res.data;
      state.formData = data;
      let obj = {};
      data.map((item) => {
        obj[item.s_key] = item.s_value;
      });
      formRef.value.resetForm({
        ...obj,
      });
    }
  });
};

// 保存
const editForm = (values) => {
  let params = state.formData.map((item) => {
    for (let key in values) {
      if (key === item.s_key) {
        return {
          s_key: key,
          s_value: values[key],
        };
      }
    }
  });
  edit({
    edit_data: params,
  }).then((res) => {
    if (res.code == 0) {
      message.success(res.msg);
      getData();
    }
  });
};

getData();
</script>
  
<style scoped lang="scss">
.container {
  display: flex;
  justify-content: center;
  height: 100%;
  overflow: auto;

  &::-webkit-scrollbar {
    width: 0;
    height: 0;
  }
}
</style>
  